@extends('layouts.mobile_main')

@section('title', '钱包')

@section('resources')
    @parent
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <link rel="stylesheet" href="{{ env('CSS_DOMAIN') }}css/public.css?v={{env('CSS_VERSION')}}">
    <script src="{{ env('JS_DOMAIN') }}/js/adaptation.js?v={{env('JS_VERSION')}}"></script>
    <style>
        .wallet{width: 100%;height: 4.91rem;background: url({{env('IMAGE_DOMAIN')}}images/wallet_background.png) 0 0 no-repeat;position: fixed;top: 0;left: 0;background-size: 100%;}
        #download{position: fixed;bottom: 1.6rem;right: 0;width: 100%;height: 1.6rem;background: rgba(172,125,204,0.8);}
        #download .down_close{position: absolute;top: -0.6rem;left: 0;width: 0.75rem;}
        #download .down_logo{width: 1.2rem;float: left;margin-left: 0.6rem;margin-top: 0.2rem;}
        #download p{float: left;margin-left: 0.6rem;overflow: hidden;width: 3rem;}
        #download span{float: left;}
        #download .down_down img{width: 2.5rem;float: left;height: 1rem;}
        #goto_download{width: 6rem;height: 4.2rem;background-color: #fff;border: 1px solid #ccc;position: fixed;top: 50%;left: 50%;margin-left: -3.6rem;margin-top: -2.1rem;padding: 0 0.6rem;display: none;}
        #goto_download .download_text{margin-bottom: 1rem;margin-top: 0.7rem}
        #goto_download .close_download{padding: 0.3rem 0.4rem;border: 1px solid #ccc;color: #ccc;border-radius: 0.2rem;}
        #goto_download .go_download{padding: 0.3rem 0.4rem;background-color: #9955c6;color: #fff;border-radius: 0.2rem;}
        .wallet_history_text .wait_num{position: absolute;top: 0.3rem;right: 0.65rem;font-size: 0.32rem;width: 0.6rem;height: 0.6rem;background-color: #ff5353;line-height: 0.6rem;text-align: center;border-radius: 50%;color: #fff;}
    </style>
    @endsection

    @section('content')
            <!-- 钱包头部 -->
    <header class="wallet">
        <p class="oh co_white wallet_top">
            <span class="fz_48 fl wallet_titl">可用余额</span>
            <a href="/mobile/wallet/course?avatar={{$avatar}}&nickname={{$nickname}}&sumday={{$sumday}}&sumrechargemoney={{$sumrechargemoney}}&sumordermoney={{$sumordermoney}}&savemoney={{$savemoney}}&createdat={{$created_at}}&firstrechargetime={{$firstrechargetime}}&firstordertime={{$firstordertime}}&firstshopname={{$firstshopname}}" class="fz_40 fr wallet_titr">翻贝轨迹></a>
        </p>
        <div class="wallet_money tc">
            <p class="fz_65" style="color: #FFEB19;margin-top: 0.1rem;margin-bottom: 1.1rem;">{{$balance}}</p>
            {{-- <p class="fz_34 co_white money_forall" style="margin-top: 0.2rem;">(<span class="money_for1">{{$notdoublemoney}}</span>翻倍为<span>{{$doublemoney}}</span>等待到账)</p> --}}
        </div>
        <ul class="wallet_pay oh">
            <li class="fl">
                <a href="/mobile/wallet/pay/way">
                    <img src="{{env('IMAGE_DOMAIN')}}images/wallet_pay.png?v={{env('IMAGE_VERSION')}}" alt="">
                    <span class="fz_48 co_white">买单</span>
                </a>
            </li>
            <li class="fr" id="wallet_recharge">
                <a href="/mobile/wallet/recharge">
                <img src="{{env('IMAGE_DOMAIN')}}images/wallet_recharge.png?v={{env('IMAGE_VERSION')}}" alt="">
                <span class="fz_48 co_white">充值</span>
                </a>
            </li>
        </ul>
    </header>
    <!-- 记录部分 -->
    <section class="wallet_history">
        <p class="wallet_history_text oh">
            <span class="fz_40 tc wait_ctn wait_all" style="border-bottom: 5px solid #9955C6;color:#9955c6">全部</span>
            <span class="fz_40 tc wait_ctn wait_rate">待评价</span>
            @if($waitcommentorder == 0)

            @else
                <span class="wait_num">{{$waitcommentorder}}</span>
            @endif
        </p>
        <div class="wallet_record_outer">
            <input type="hidden" name="page1" value="0">
            <input type="hidden" name="page2" value="0">
            <ol class="wallet_record" id="wallet_record1">
                {{--@foreach($orderlists as $list)--}}
                    {{--<li class="oh">--}}
                        {{--<a href="/mobile/wallet/order/get?ordernumber={{$list['ordernumber']}}">--}}
                            {{--<div class="fl" style="margin-left: 0.6rem;">--}}
                                {{--<p class="fz_40 co_black">{{$list['shopname']}}</p>--}}
                                {{--<div class="oh">--}}
                                    {{--@if($list['actualamount'] == $list['orderamount'])--}}
                                        {{--<span class="fz_28 fl co_gray shiji">{{$list['actualamount']}}</span>--}}
                                    {{--@else--}}
                                        {{--<span class="fz_28 fl co_gray shiji">{{$list['actualamount']}}</span>--}}
                                        {{--<span class="fz_28 fl co_gray" style="text-decoration: line-through;margin-left: 0.2rem;">{{$list['orderamount']}}</span>--}}
                                    {{--@endif--}}
                                {{--</div>--}}
                            {{--</div>--}}
                            {{--<div class="fr oh wallet_record_right">--}}
                                {{--@if($list['commentstatus'] == '1')--}}
                                    {{--<p class="fz_34 fr co_gray wallet_evaluate">已评价</p>--}}
                                {{--@else--}}
                                    {{--<a href="/mobile/wallet/comment?ordernumber={{$list['ordernumber']}}&shopname={{$list['shopname']}}">--}}
                                        {{--<p class="fz_34 fr co_orange wallet_evaluate" style="color:#FF2E2F;border:1px solid #FF2E2F;border-radius:0.2rem;">待评价</p>--}}
                                    {{--</a>--}}
                                {{--@endif--}}
                                {{--<p class="fz_28 fr co_gray">{{date('Y-m-d', strtotime($list['created_at']))}}</p>--}}
                            {{--</div>--}}
                        {{--</a>--}}
                    {{--</li>--}}
                {{--@endforeach--}}
            </ol>
            <ol class="wallet_record hide" id="wallet_record2">
                {{--@foreach($orderlists as $list)--}}
                    {{--<li class="oh">--}}
                        {{--<a href="/mobile/wallet/order/get?ordernumber={{$list['ordernumber']}}">--}}
                            {{--<div class="fl" style="margin-left: 0.6rem;">--}}
                                {{--<p class="fz_40 co_black">{{$list['shopname']}}</p>--}}
                                {{--<div class="oh">--}}
                                    {{--@if($list['actualamount'] == $list['orderamount'])--}}
                                        {{--<span class="fz_28 fl co_gray shiji">{{$list['actualamount']}}</span>--}}
                                    {{--@else--}}
                                        {{--<span class="fz_28 fl co_gray shiji">{{$list['actualamount']}}</span>--}}
                                        {{--<span class="fz_28 fl co_gray" style="text-decoration: line-through;margin-left: 0.2rem;">{{$list['orderamount']}}</span>--}}
                                    {{--@endif--}}
                                {{--</div>--}}
                            {{--</div>--}}
                            {{--<div class="fr oh wallet_record_right">--}}
                                {{--@if($list['commentstatus'] == '1')--}}
                                    {{--<p class="fz_34 fr co_gray wallet_evaluate">已评价</p>--}}
                                {{--@else--}}
                                    {{--<a href="/mobile/wallet/comment?ordernumber={{$list['ordernumber']}}&shopname={{$list['shopname']}}">--}}
                                        {{--<p class="fz_34 fr co_orange wallet_evaluate" style="color:#FF2E2F;border:1px solid #FF2E2F;border-radius:0.2rem;">待评价</p>--}}
                                    {{--</a>--}}
                                {{--@endif--}}
                                {{--<p class="fz_28 fr co_gray">{{date('Y-m-d', strtotime($list['created_at']))}}</p>--}}
                            {{--</div>--}}
                        {{--</a>--}}
                    {{--</li>--}}
                {{--@endforeach--}}
            </ol>
        </div>
    </section>

    @include('layouts.mobile_footer')
    <nav id="download">
        <img class="down_close" src="{{env('IMAGE_DOMAIN')}}images/index_close.png?v={{env('IMAGE_VERSION')}}" alt="">
        <img class="down_logo" src="{{env('IMAGE_DOMAIN')}}images/index_logo.png?v={{env('IMAGE_VERSION')}}" alt="">
        <p>
            <span class="fz_48 co_white" style="margin-top: 0.2rem;">翻贝网App</span>
            <span class="fz_40 co_white">翻贝网·翻倍花</span>
        </p>
        <a class="down_down" href="/mobile/app/download" style="float: right;margin-top: 0.3rem;margin-right: 0.6rem;"><img src="{{env('IMAGE_DOMAIN')}}images/index_download.png?v={{env('IMAGE_VERSION')}}" alt=""></a>
    </nav>
    <!-- <nav id="goto_download">
        <p class="fz_48 tc download_text">充值功能请下载APP</p>
        <p>
            <span class="close_download fz_40 fl">下次再说</span>
            <span class="go_download fz_40 fr">前往下载app</span>
        </p>
    </nav> -->
@endsection

@section('scriptResources')
    @parent
    <script src="{{env('JS_DOMAIN')}}js/include.js?v={{env('JS_VERSION')}}"></script>
    <script>
        window.onresize=function(){
            pagesp();
        }
        var onOff=true;
        var wallet_history_h=$(window).height()-$(".wallet").height()-$(".wallet_history_text").height()-$("footer").height();
        var wallet_history_t=$(".wallet").height()+$(".wallet_history_text").height();
        var wallet_history_text_t=$(".wallet").height();
        $(".wallet_history").css({"min-height":wallet_history_h,"margin-top":wallet_history_t});
        $(".wallet_history_text").css("top",wallet_history_text_t);
        if($('.money_for1').html()=='0'){
            $('.money_forall').hide();
            $('.wallet_pay').css({'margin-top':'1.2rem'})
        }
        //全部订单列表
        function wallet_record1(){
            var wallet_record1 = document.getElementById('wallet_record1');
            var page = parseInt($("input[name='page1']").val()) + 1;
            $.ajax({
                url : "/mobile/wallet/order/list",
                type: 'get',
                data: { page:page },
                dataType:'json',
                success:function(result){
                    if (result.status == 'success') {
                        var lists = result.data.data;
                        for (i = 0; i < (lists.length); i++) {
                            var list = lists[i];
                            li = document.createElement('li');
                            li.innerHTML =  '<a href="/mobile/wallet/order/get?ordernumber='+list.ordernumber + '">' +
                                                '<div class="fl" style="margin-left: 0.6rem;"><p class="fz_40 co_black">' + list.shopname + '</p>' +
                                                    '<div class="oh"><span class="fz_28 fl co_gray shiji">'+list.actualamount+'</span></div>' +
                                                '</div>';
                                           if(list.commentstatus == '1') { 
                                                li.innerHTML +='<div class="fr oh wallet_record_right">'+'<p class="fz_34 fr co_gray wallet_evaluate">已评价</p><p class="fz_28 fr co_gray">'+list.created_at.substring(0,10)+'</p></div></a>';
                                           } else {
                                                li.innerHTML +=  '<div class="fr oh wallet_record_right">'+'<a href="/mobile/wallet/comment?ordernumber='+list.ordernumber+'&shopname=' + list.shopname + '">' +
                                                    '<p class="fz_34 fr co_orange wallet_evaluate" style="color:#FF2E2F;border:1px solid #FF2E2F;border-radius:0.2rem;">待评价</p></a><p class="fz_28 fr co_gray">'+list.created_at.substring(0,10)+'</p></div></a>';
                                           }
                            wallet_record1.appendChild(li, wallet_record1.childNodes[0]);
                        }
                        $("#wallet_record1 li").addClass('oh');
                        $("input[name='page1']").val(page);
                    }
                    onOff=true;
                }
            });
        }
        //未评论订单列表
        function wallet_record2(){
            var wallet_record2 = document.getElementById('wallet_record2');
            var page = parseInt($("input[name='page2']").val()) + 1;
            $.ajax({
                url : "/mobile/wallet/order/list",
                type: 'get',
                data: {
                    page:page,
                    commentstatus:'0'
                    },
                dataType:'json',
                success:function(result){
                    if (result.status == 'success') {
                        var lists = result.data.data;
                        for (i = 0; i < lists.length; i++) {
                            var list = lists[i];
                            li = document.createElement('li');
                            li.innerHTML =  '<a href="/mobile/wallet/order/get?ordernumber='+list.ordernumber + '">' +
                                                '<div class="fl" style="margin-left: 0.6rem;"><p class="fz_40 co_black">' + list.shopname + '</p>' +
                                                    '<div class="oh"><span class="fz_28 fl co_gray shiji">'+list.actualamount+'</span></div>' +
                                                '</div>' +
                                                '<div class="fr oh wallet_record_right">' +
                                                    '<a href="/mobile/wallet/comment?ordernumber='+list.ordernumber+'&shopname=' + list.shopname + '"><p class="fz_34 fr co_orange wallet_evaluate" style="color:#FF2E2F;border:1px solid #FF2E2F;border-radius:0.2rem;">待评价</p></a><p class="fz_28 fr co_gray">'+list.created_at.substring(0,10)+'</p>' +
                                                '</div>' +
                                                '</a>';
                            wallet_record2.appendChild(li, wallet_record2.childNodes[0]);
                        }
                        $("#wallet_record2 li").addClass('oh');
                        $("input[name='page2']").val(page);
                    }
                    onOff=true;
                }
            });
        }
        $(function(){
            // $("#wallet_recharge").click(function(){
            //     $("#goto_download").show();
            // });
            // $(".close_download").click(function(){
            //     $("#goto_download").hide();
            // });
            // $(".go_download").click(function(){
            //     window.open("/mobile/app/download","_blank");
            //     $("#goto_download").hide();
            // });
            $(".down_close").click(function(){
                $("#download").hide();
            })
            var choose = true;
            $(".wallet_history_text .wait_all").click(function(){
                choose = true;
                $(".wallet_history_text .wait_all").css({"border-bottom":"5px solid #9955C6","color":"#9955c6"});
                $(".wallet_history_text .wait_rate").css({"border-bottom":"none","color":"#808080"});
                $("#wallet_record1").show();
                $("#wallet_record2").hide();
            })
            $(".wallet_history_text .wait_rate").click(function(){
                choose = false;
                $(".wallet_history_text .wait_rate").css({"border-bottom":"5px solid #9955C6","color":"#9955c6"});
                $(".wallet_history_text .wait_all").css({"border-bottom":"none","color":"#808080"});

                $("#wallet_record2").show();
                $("#wallet_record1").hide();
            })
            $(window).scroll(function(){
                var hh=$(document).height();
                var wh=$(window).height();
                var sc=$(document).scrollTop();
                if (hh-wh-sc<=30&&onOff) {
                    onOff=false;
                    if(choose){
                        wallet_record1();
                    }else{
                        wallet_record2();
                    }
                };
            })
        })
        wallet_record1();
        wallet_record2();
    </script>
@endsection